<template>
    <div class="columns mt-6 content">
        <div class="columns mt-6">
            <div class="mt-6">
                <p >UH OH! 页面丢失</p>
                <p class="subtitle mt-6">
                    您所寻找的页面不存在，{{ times }}秒后，将返回首页！
                </p>
            </div>
        </div>
    </div>
</template>

<script>

    export default {
        name: "404",
        data() {
            return {
                times: 10
            }
        },
        //在页面开始加载的时候
        created(){
            //请求后台方法
            this.goHome()
        },
        methods: {
            //定时器
            goHome: function () {
               this.timer = setInterval(() =>{
                   this.times--
                   if (this.times === 0){
                       //清空定时器
                       clearInterval(this.timer)
                       //页面跳转
                       this.$router.push({path:'/'})
                   }
               },1000)
            }
        }
    }
</script>

<style scoped>

</style>